<template>
  <div class="my-income-layout">
    <snackbar style-color="#4A4A4A"
              back-color="#ffffff"
              status-color="#ffffff"
              rightText="跳过"
              :fixed="true">
    </snackbar>
    <div class="subject">
      <div class="gxname">
        <input class="gxname_input" type="text" placeholder="请输入你所在公司名称" />
      </div>
      <div class="card">
        <div class="card_name">
          <span class="name_text">柳州市千里科技有限公司</span>
        </div>
        <div class="address">
          <div>
            <span>广西省</span>
          </div>
          <div class="jiaru">
            <span class="jiaru_text">加入</span>
          </div>
        </div>
      </div>
      <div class="card">
        <div class="card_name">
          <span class="name_text">柳州市炳圣建筑工程有限责任公司
</span>
        </div>
        <div class="address">
          <div>
            <span>广西省</span>
          </div>
          <div class="jiaru">
            <span class="jiaru_text">加入</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'income',
    data() {
      return {
        active: null
      }
    }
  }
</script>

<style lang="scss" scoped>

  .my-income-layout {
    width: 100vw;
    height: 100vh;
    background-color: #FFFFFF;
    .top-layout {
      display: flex;
      flex-direction: row;
      align-items: center;
      border-bottom: 1px solid rgba(219, 219, 219, 0.5);
      width: 100vw;
      background-color: white;

      .tebs-layout {
        width: 100vw;
      }
    }
    .subject{
      width: 80vw;
      // height: 100%;
      margin: 3% auto 0 auto;
      // background-color: #007AFF;
      .gxname{
        width: 94%;
        border-radius: 4px;
        font-size: 1.5em;
        padding: 3% 3% ;
        border: 2px solid #65B651 ;
        margin-bottom: 10%;
        // background-color: #55A532;
      }
      .card{
        width: 100%;
        height: 15vh;
        font-size: 1.3em;
        margin-top: 5%;
        background-color: #FFFFFF;
        border-radius: 5px;
        border: 1px solid #C4C4C4 ;
        .card_name{
          width: 90%;
          height: 5vh;
          margin: 0 auto;
          padding-top: 5%;
          .name_text{
            margin-top: 10px;
          }
        }
        .address{
          width: 90%;
          margin: 0 auto;
          padding-top: 7%;
          display: flex;
          justify-content: space-between;
          color: #9B9B9B;
          .jiaru{
            width: 25%;
            text-align: center;
            border-radius: 3px;
            color: #FFFFFF;
            background-color: #65B651;
            .jiaru_text{
            }
          }
        }
      }
    }
  }
</style>
